<template>
  <van-row class="page-grade-resume">
    <van-nav-bar left-text="返回" :title="assessType === $vo.AssessType.CORP + '' ? '公司考评概览' : '单位考评概览'" @click-left="$router.back()"/>
    <van-row class="aprrove-resume">
      <van-row>
        <van-icon name="bar-chart-o" style="margin-right: 5px; line-height: 20px" size="16"/>
<!--        <span>{{assessType === $vo.AssessType.CORP + '' ? '单位评分情况' : '部门评分情况'}}</span>-->
        <span>部门评分情况</span>
      </van-row>
      <van-row>
        <van-col span="8">
          <span>考核问题：</span>
          <span>{{ problemTotal }}</span>
        </van-col>
        <van-col span="8">
          <span>待审核：</span>
          <span>{{ checkTotal }}</span>
        </van-col>
        <van-col span="8">
          <span>审核同意：</span>
          <span>{{ agreeTotal }}</span>
        </van-col>
      </van-row>
    </van-row>
    <van-row>
      <card-grade-resume
        v-for="(resume) in resumeList"
        :key="resume.department_path"
        :resume="resume"
        :assessType="assessType"
        @onClick="doClick"/>
    </van-row>
    <van-popup
      v-model="showPageApproveList"
      position="right"
      get-container="body"
      style="width: 100%; height: 100%; background-color: #F9F9F9">
      <page-approve-list v-if="showPageApproveList" :assessType="assessType" :operateType="operateType" :department="selectedDept" :batchDept="batchDept" @onCancel="showPageApproveList = false"/>
    </van-popup>
    <van-dialog v-if="assessType === $vo.AssessType.CORP + ''" style="width: 90%" v-model="showDialog" title="请选科室" show-cancel-button :before-close="verifyOperate">
      <template #title>
        <van-row>
          请选择科室
        </van-row>
        <van-row style="font-size: 14px;color: #969799">
          {{deopeass.substring(deopeass.indexOf('/') + 1)}}
        </van-row>
      </template>
      <van-radio-group v-model="selectedDept">
        <van-cell-group style="margin-top: 20px" :border="false">
          <card-dept
            v-for="(depart) in deptList"
            :key="depart.department_path"
            :department="depart"
            :operate="currentOp"
            @onClick="startSelectDept(depart)"/>
        </van-cell-group>
      </van-radio-group>
      <van-row style="font-size: 12px;color: red;text-align: center;height:30px; line-height: 30px">{{showError ? '请选择一个部门' : ''}}</van-row>
    </van-dialog>
    <van-dialog style="width: 90%" v-model="showRefuseDialog" title="请输入退回重评理由" show-cancel-button @opened="getFocus" :before-close="verifyRefuseReason">
      <van-field
        :border="false"
        v-model="refuseReason"
        rows="4"
        autosize
        type="textarea"
        maxlength="100"
        placeholder="请输入退回重评理由"
        @focus="showInputError = false"
        ref="refuseReason"
        show-word-limit/>
      <van-row style="font-size: 12px;color: red;text-align: center;height:30px; line-height: 30px">{{showInputError ? '退回重评理由不能为空' : ''}}</van-row>
    </van-dialog>
  </van-row>
</template>

<script>
import CardDept from '@/views/common/card/CardDept'
import CardGradeResume from '@/views/common/card/CardGradeResume'
import PageApproveList from '@/views/grade/PageApproveList'
import { getApproveStat, batchUpdateProblem } from '@/api/assess'
export default {
  name: 'PageGradeResume',
  components: { CardDept, CardGradeResume, PageApproveList },
  props: ['assessType', 'operateType'],
  data () {
    return {
      showPageApproveList: false,
      showDialog: false,
      showRefuseDialog: false,
      selectedDept: null,
      deptList: [],
      showError: false,
      showInputError: false,
      currentOp: '',
      problemTotal: 0,
      checkTotal: 0,
      agreeTotal: 0,
      resumeList: [],
      refuseReason: '',
      batchDept: '',
      deopeass:''
    }
  },
  mounted () {
    this.deopeass = this.$route.query.bmmc != undefined ? this.$route.query.bmmc : this.$store.state.authInfo.currentDept.department_path
    this.doQuery()
  },
  methods: {
    doQuery () {
      let condition = {}
      condition.user_id = this.$store.state.authInfo.user.userid
      condition.department_path = this.deopeass
      condition.check_type = this.assessType
      getApproveStat(condition).then(res => {
        let { data } = res
        if (data[this.$response.CODE] === this.$response.SUCCESS) {
          this.problemTotal = data[this.$response.DATA].stat_total.total
          this.checkTotal = data[this.$response.DATA].stat_total.approve
          this.agreeTotal = data[this.$response.DATA].stat_total.accept
          this.resumeList = data[this.$response.DATA].stat_list
        } else {
          this.$toast.fail('获取数据失败：' + data[this.$response.MESSAGE])
        }
      }, errFunc => {
        this.$notify('服务调用失败：' + errFunc.toString())
        console.log(errFunc.toString())
      })
    },
    doClick (resume, op) {
      this.selectedDept = null
      this.refuseReason = ''
      this.currentOp = op
      this.batchDept = resume.department_path
      if ((this.assessType === this.$vo.AssessType.CORP + '') && resume.subDeptStat.length !== 1) {
        this.deptList = [{ department_path: '所有科室' }].concat(resume.subDeptStat)
        this.showDialog = true
      } else {
        console.log(this.$store.state.authInfo)
        this.selectedDept = this.$store.state.authInfo.currentDept
        this.doSelectedDept()
      }
    },
    doSelectedDept () {
      if (this.currentOp === 'show') {
        // 查询列表
        this.showPageApproveList = true
      } else if (this.currentOp === 'refuse') { // 批量退回
        this.showRefuseDialog = true
      } else { // 批量同意
        this.batchSubmit('batchAgree')
      }
    },
    startSelectDept (depart) {
      this.showError = false
      this.selectedDept = depart
    },
    verifyOperate (action, done) {
      if (action === 'confirm' && !this.selectedDept) {
        this.showError = true
        done(false)
      } else if (action === 'confirm' && this.selectedDept) {
        this.selectedDept = this.selectedDept.department_path === '所有科室' ? this.$store.state.authInfo.currentDept : this.selectedDept
        if (this.currentOp === 'show') {
          // 查询列表
          this.showPageApproveList = true
        } else if (this.currentOp === 'refuse') { // 批量退回
          this.showRefuseDialog = true
        } else { // 批量同意
          this.batchSubmit('batchAgree')
        }
        done()
      } else {
        done()
      }
    },
    batchSubmit (op) {
      // 调用结果提交接口
      let submitObj = {}
      submitObj.op = op
      submitObj.user_id = this.$store.state.authInfo.user.userid
      submitObj.department_path = this.$route.query.bmmc != undefined ? this.$route.query.bmmc : this.selectedDept.department_path
      submitObj.check_type = this.assessType
      submitObj.refuse_reason = this.refuseReason
      submitObj.receivers = []
      submitObj.batchDept = this.batchDept
      batchUpdateProblem(submitObj).then(res => {
        let { data } = res
        if (data[this.$response.CODE] === this.$response.SUCCESS) {
          this.doQuery()
          this.$toast.success('批量提交成功')
        } else {
          this.$dialog.alert({ message: '批量提交失败：' + data[this.$response.MESSAGE] })
        }
      }, errFunc => {
        this.$notify('服务调用失败：' + errFunc.toString())
      })
    },
    verifyRefuseReason (action, done) {
      if (action === 'confirm' && this.refuseReason.trim() === '') {
        this.showInputError = true
        done(false)
      } else if (action === 'confirm' && this.refuseReason.trim() !== '') {
        this.batchSubmit('batchReject')
        done()
      } else {
        done()
      }
    },
    getFocus () {
      this.$refs.refuseReason.focus()
    }
  }
}
</script>

<style scoped lang="less">
  .page-grade-resume {
    background-color: #F9F9F9;
    .aprrove-resume {
      padding: 10px 16px;
      background: white;
      font-size: 14px;
      color: #323233;
      .van-row:first-child {
        padding-bottom: 10px;
      }
    }
  }
</style>
